:root {
  --base-font-size-sm: 15px;
  --base-font-size-md: 16px;
  --base-font-size-lg: 18px;
  --base-font-size-xl: 20px;
  --border-radius: 0.25rem;
  --color-black: #000;
  --color-gray-1: rgba(255, 255, 255, 0.085);
  --color-gray-2: rgba(255, 255, 255, 0.18);
  --color-gray-3: rgba(255, 255, 255, 0.32);
  --color-gray-4: rgba(255, 255, 255, 0.49);
  --color-gray-5: rgba(255, 255, 255, 0.72);
  --color-white: #fff;
  --color-highlight-bg: #141f28;
  --color-highlight-fg: #7cc4f8;
  --font-family:
    -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif,
    'Apple Color Emoji', 'Segoe UI Emoji';
  --font-family-code:
    SFMono-Regular, Consolas, 'Liberation Mono', Menlo, monospace;
  --font-weight-regular: normal;
  --font-weight-bold: 500;
  --font-size-code: 90%;
  --font-size-sm: 0.8rem;
  --font-size-md: 1rem;
  --line-height-sm: 1.25rem;
  --line-height-md: 1.75rem;
  --space-025: 0.25rem;
  --space-050: 0.5rem;
  --space-075: 0.75rem;
  --space-100: 1rem;
  --space-150: 1.5rem;
  --space-200: 2rem;
  --space-250: 2.5rem;
  --space-300: 3rem;
  --space-400: 4rem;
  --space-500: 5rem;
  --width-main: 40rem;
  --width-secondary: 14rem;
  --z-index-1: 1;
  --z-index-2: 2;
  --z-index-3: 3;
}
